import React from 'react'
import { Modal} from 'antd'
import Table from '../../../components/Table'
import 'whatwg-fetch'
import API from '../../../axios/api'

require('es6-promise').polyfill();

const columns = [
    { dataIndex: 'Title', title: '活动名称', width: 200,},
    { dataIndex: 'GroupBuyingTypeString', title: '活动类型', width: 200,},
    { dataIndex: 'StatusString', title: '活动状态', width: 200,},
    { dataIndex: 'StartTimeString', title: '活动时间', width: 200,},
    { dataIndex: 'OrderTotalAmount', title: '销售金额', width: 200,},
    { dataIndex: 'OrderCount', title: '下单数量', width: 200,},
]

export default class SalesDetailList extends React.Component {
    constructor(props) {
        super(props)
        this.state = {
            tData: [],
            item: {},
            loading: true,
        }
    }

    // 获取表格数据
    fetchTableData =  async (userId, monthTime) => {
        let parms = {
            ...API.config,
            HallUserId: userId,
            MonthTime: monthTime || '',
        }
        await API.getMonthGroupBuying(parms).then((res) => {
            if(res.Code === 200) {
                this.setState({
                    tData: res.Data.GroupBuyingList
                });
            }
            this.setState({
                loading: false
            });
        })
    }

    componentWillReceiveProps(nextProps, nextContext) {
        if(this.state.userId !== nextProps.userId){
            this.setState({
                userId: nextProps.userId
            })
            this.fetchTableData(nextProps.userId, nextProps.monthTime)
        }
    }

    // componentDidMount() {
    //     this.fetchTableData()
    // }

    tableAction = (actionKey, item) => {
    }


    render() {
        const {
            modalKey,
            visible,
            title,
            onCancel,
            width,
        } = this.props
        return (
            <Modal
                wrapClassName="form"
                key={modalKey}
                visible={visible}
                title={title}
                onCancel={onCancel}
                footer={null}
                width={width}
            >
            <div id="wrap">
                <div className="tableBox">
                    <div style={{ paddingTop: 10 }}>
                        <Table
                            onCtrlClick={ this.tableAction }
                            pagination={ true }
                            pageSize={10}
                            header={ columns }
                            data={ this.state.tData }
                            loading={ this.state.loading }
                            scroll={{y: 385 }}
                        />
                    </div>
                </div>
            </div>
            </Modal>
        )
    }
}
